<!--家长控制-->
<div class="homenet-ctrl">
    <!--已控制上网设备列表-->
    <div class="content">
        <!--设备列表标题-->
        <div class="clearfix">
            <h2>已控制上网设备</h2>
            <button class="btn-wider"><i class="icon iconfont icon-tianjia"></i><span>添加设备控制</span>
            </button>
        </div>
        <!--设备列表-->
        <ul class="device-list">
            <!--设备列表项-->
            <li class="device-list-item">
                <!--设备基本信息-->
                <div class="device">
                    <i class="icon iconfont icon-diannao"></i>
                    <div class="device-info">
                        <p class="device-name"><span>设备名称</span><span>FJSDIFJSDJJFKSDF775</span></p>
                        <p class="device-ip"><span>IP地址：</span><span>255.255.255.255</span></p>
                    </div>
                </div>
                <!--设备模板-->
                <div class="net-module">
                    <p class="use-module"><span>使用控制模板</span></p>
                    <p class="name-module"><span>模板名字</span></p>
                </div>
                <!--设备模板生效时间-->
                <div class="module-active">
                    <p class="module-active-title"><span>生效时间</span></p>
                    <p class="time-module"><span>2016.11.21</span><span>-</span><span>2016.12.30</span></p>
                </div>
                <!--设备操作-->
                <div class="list-operate">
                    <ul class="operates clearfix">
                        <li class="opt-unlock">
                            <p><span><i class="icon iconfont icon-suo1"></i></span></p>
                            <p class="text-operate"><span>解除控制</span></p>
                            <div class="toast ">
                                <h3>解除上网限制</h3>
                                <div>
                                    <div class="toast-body"><p>是否解除对该设备的上网控制？</p></div>
                                    <div class="form-control">
                                        <input type="button" value="确定">
                                        <input type="button" value="取消">
                                    </div>
                                </div>
                            </div>
                        </li>
                        <li class="opt-detail">
                            <p>
                                <a href="">
                                    <span><i class="icon iconfont icon-xiangqing1"></i></span>
                                </a>
                            </p>
                            <p class="text-operate"><span>详情</span></p>
                        </li>
                    </ul>
                </div>
            </li>
            <li class="device-list-item">
                <!--设备基本信息-->
                <div class="device">
                    <i class="icon iconfont icon-diannao"></i>
                    <div class="device-info">
                        <p class="device-name"><span>设备名称</span><span>FJSDIFJSDJJFKSDF775</span></p>
                        <p class="device-ip"><span>IP地址：</span><span>255.255.255.255</span></p>
                    </div>
                </div>
                <!--设备模板-->
                <div class="net-module">
                    <p class="use-module"><span>使用控制模板</span></p>
                    <p class="name-module"><span>模板名字</span></p>
                </div>
                <!--设备模板生效时间-->
                <div class="module-active">
                    <p class="module-active-title"><span>生效时间</span></p>
                    <p class="time-module"><span>2016.11.21</span><span>-</span><span>2016.12.30</span></p>
                </div>
                <!--设备操作-->
                <div class="list-operate">
                    <ul class="operates clearfix">
                        <li class="opt-unlock">
                            <p><span><i class="icon iconfont icon-suo1"></i></span></p>
                            <p class="text-operate"><span>解除控制</span></p>
                            <div class="toast ">
                                <h3>解除上网限制</h3>
                                <div>
                                    <div class="toast-body"><p>是否解除对该设备的上网控制？</p></div>
                                    <div class="form-control">
                                        <input type="button" value="确定">
                                        <input type="button" value="取消">
                                    </div>
                                </div>
                            </div>
                        </li>
                        <li class="opt-detail">
                            <p>
                                <a href="">
                                    <span><i class="icon iconfont icon-xiangqing1"></i></span>
                                </a>
                            </p>
                            <p class="text-operate"><span>详情</span></p>
                        </li>
                    </ul>
                </div>
            </li>
        </ul>
    </div>
    <!--自定义控制模板-->
    <div class="content ">
        <!--自定义控制模板标题-->
        <div class="clearfix">
            <h2>自定义控制模板</h2>
        </div>
        <ul class="module-list clearfix">
            <li class="module-list-item">
                <button class="add-module"><i class="icon iconfont icon-tianjia"></i><span>新增模板</span></button>
            </li>
            <li class="module-list-item">
                <i class="icon iconfont icon-sheweimoban"></i>
                <span>模板一</span>
                <span>模板名称模板名称</span>
            </li>
            <li class="module-list-item">
                <i class="icon iconfont icon-sheweimoban"></i>
                <span>模板一</span>
                <span>模板名称模板名称</span>
            </li>
        </ul>
    </div>
    <!--系统模板-->
    <div class="content system-module">
        <!--系统模板-->
        <div class="clearfix">
            <h2>系统模板</h2>
        </div>
        <ul class="module-list clearfix">
            <li class="module-list-item">
                <i class="icon iconfont icon-sheweimoban"></i>
                <span>模板一</span>
                <span>模板名称模板名称</span>
            </li>
            <li class="module-list-item">
                <i class="icon iconfont icon-sheweimoban"></i>
                <span>模板一</span>
                <span>模板名称模板名称</span>
            </li>
            <li class="module-list-item">
                <i class="icon iconfont icon-sheweimoban"></i>
                <span>模板一</span>
                <span>模板名称模板名称</span>
            </li>
            <li class="module-list-item">
                <i class="icon iconfont icon-sheweimoban"></i>
                <span>模板一</span>
                <span>模板名称模板名称</span>
            </li>
            <li class="module-list-item">
                <i class="icon iconfont icon-sheweimoban"></i>
                <span>模板一</span>
                <span>模板名称模板名称</span>
            </li>
        </ul>
    </div>
</div>